import React, { useState, useEffect } from 'react'

export default function Test() {
  const [count, setCount] = useState(10)
  let timer = null // !#1
  useEffect(() => {
    // 这里代码只会执行 1 次，也就只产生了 1 次闭包变量 timer
    // 保证了 #2 处的 timer 变量就是第 1 次被引用的 #1 处的闭包变量 timer
    // eslint-disable-next-line react-hooks/exhaustive-deps
    timer = setInterval(() => {
      setCount((count) => count - 1)
    }, 1000)
    return () => {
      clearInterval(timer) // !#2
    }
  }, [])
  return (
    <div>
      <h3>{count}</h3>
    </div>
  )
}
